import React from 'react';
import { Card, Modal, Button } from 'antd';
import PropTypes from 'prop-types';
import DescriptionList from '../../components/DescriptionList';
import { getDicByKey } from '@/support/common';

const { Description } = DescriptionList;
class tboxDetailModal extends React.PureComponent {
  static contextTypes = {
    dicData: PropTypes.array,
  };
  render() {
    const deviceStatus = ['出厂', '销售', '激活', '替换', '报废'];
    const enrollStatus = ['', '成功', '失败', '进行中'];
    const { changeVisible, detailModelData } = this.props;
    return (
      <Modal
        title="详细信息"
        style={{ top: 20 }}
        width="700px"
        visible={this.props.visible}
        onCancel={() => changeVisible()}
        footer={[
          <Button key="back" type="primary" size="small" onClick={() => changeVisible()}>
            返回
          </Button>,
        ]}
      >
        <div>
          <Card bordered={false} size="small" type="inner">
            <DescriptionList title="" col={2}>
              <Description term="设备ID" style={{ width: '50%' }}>
                {detailModelData.deviceId}
              </Description>
              <Description term="设备名称" style={{ width: '50%' }}>
                {detailModelData.deviceName}
              </Description>
              <Description term="硬件版本号" style={{ width: '100%' }}>
                {detailModelData.versionHardware}
              </Description>
              <Description term="软件版本号" style={{ width: '100%' }}>
                {detailModelData.versionSoftware}
              </Description>
              <Description term="批次号" style={{ width: '50%' }}>
                {detailModelData.batchNo}
              </Description>
              <Description term="设备状态" style={{ width: '50%' }}>
                {deviceStatus[detailModelData.deviceStatus]}
              </Description>
              <Description term="IMEI" style={{ width: '50%' }}>
                {detailModelData.imei}
              </Description>
              <Description term="激活状态" style={{ width: '50%' }}>
                {enrollStatus[detailModelData.enrollStatus]}
              </Description>
              <Description term="激活日期" style={{ width: '50%' }}>
                {detailModelData.enrollDate}
              </Description>
              <Description term="生产日期" style={{ width: '50%' }}>
                {detailModelData.produceDate}
              </Description>
              <Description term="WIFI账户" style={{ width: '50%' }}>
                {detailModelData.ssid}
              </Description>
              <Description term="WIFI密码" style={{ width: '50%' }}>
                {detailModelData.pin}
              </Description>
              <Description term="蓝牙ID" style={{ width: '50%' }}>
                {detailModelData.bluetoothId}
              </Description>
              <Description term="蓝牙MAC" style={{ width: '50%' }}>
                {detailModelData.bluetoothMac}
              </Description>
              <Description term="蓝牙名称" style={{ width: '50%' }}>
                {detailModelData.bluetoothName}
              </Description>
              <Description term="定位蓝牙ID" style={{ width: '50%' }}>
                {detailModelData.locBluetoothIds}
              </Description>
              <Description term="入库时间" style={{ width: '50%' }}>
                {detailModelData.createDate}
              </Description>
              <Description term="aesKey" style={{ width: '100%' }}>
                {detailModelData.aesKey}
              </Description>
              <Description term="atbType" style={{ width: '50%' }}>
                {detailModelData.atbType}
              </Description>
              <Description term="eolDate" style={{ width: '50%' }}>
                {detailModelData.eolDate}
              </Description>
              <Description term="apnFlag" style={{ width: '50%' }}>
                {getDicByKey(this.context.dicData, 'apnFlag', detailModelData.apnFlag)}
              </Description>
              <Description term="productReference" style={{ width: '50%' }}>
                {detailModelData.productReference
                  ? getDicByKey(
                      this.context.dicData,
                      'productReference',
                      detailModelData.productReference,
                    )
                  : '高级T'}
              </Description>
            </DescriptionList>
          </Card>
        </div>
      </Modal>
    );
  }
}

export default tboxDetailModal;
